import axios from 'axios'

/* 方法一：传入三个参数，参数二和三是一个函数，通过运行函数，把网络请求的结果传出去
export function request(config,success,failure){
  const instance1= axios.create({
    baseURL: 'http://123.207.32.32:8000',
    timeout: 5000
  })
  // 发送真正的网络请求
  instance1(config)
    .then(res => {
    success(res)
    })
    .catch(err => {
      failure(err)
    })
}*/


// 方法二： 把三个参数放到一个对象里，一起传过来。
/*
export function request(config){
  const instance1= axios.create({
    baseURL: 'http://123.207.32.32:8000',
    timeout: 5000
  })
  // 发送真正的网络请求
  instance1(config.baseconfig)
    .then(res => {
      config.success(res)
    })
    .catch(err => {
      config.failure(err)
    })
}*/

// 方法三：通过返回Promise
/*
export function request(config){
  return new Promise((resolve,reject) => {
    const instance1= axios.create({
      baseURL: 'http://123.207.32.32:8000',
      timeout: 5000
    })
    instance1(config)
      .then(res => {
        resolve(res)
      })
      .catch(err => {
        resolve(err)
      })
  })
}*/

//最终方案：直接return 实例
export function request(config){
  const instance1 = axios.create({
    // 1.创建axios的实例
    baseURL: 'http://123.207.32.32:8000',
    timeout: 5000
  })
  // 2.axios的拦截器 请求拦截和响应拦截
  // 拦截instance1实例的请求 参数一：当axios发送请求成功来到这个函数， 参数二：当请求失败来到这个函数
  instance1.interceptors.request.use(config =>{
    console.log(config);
  //  1.比如config中的一些信息不符合服务器的要求，可以拦截下来后修改一下再返回出去
  //  2.比如每次发送网络请求时，都希望在界面中显示一个正在请求的图标，可以把图标show出来，
    //  当请求成功的时候，再在响应拦截这里把这个图标隐藏起来
  //  3. 某些网络请求（比如登录token），必须携带一些特殊的信息
  //  把拦截下来的请求返回出去，要不然网络请求失败
    return config
  },err => {
    console.log(err);
  })
  // 拦截instance1实例的响应 参数一：返回结果成功进入这个函数 参数二：返回错误信息进入这个函数
  instance1.interceptors.response.use(res => {
    console.log(res);
  //   把拦截下来的结果返回出去
    return res.data
  },err => {
    console.log(err);
  })

  // axios是支持promise的，axios()本身会返回一个promise，
  // 它在内部拿到数据之后会调用一个内部的resolve()，然后把网络请求的数据通过resolve传给then
  // return 实例，就是返回了一个promise
  return instance1(config)
}
